<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="./js/jquery.min.js"></script>
</head>

<body>
  <!-- 一般来说，如果需要存储用户自定义数据，并且在后期获取相应的值，那么自定义属性是一个比较优的选择
  1.它的定义：data-自定义属性名称 = '值'
  2.它的取值比attr要好，因为它可以一次性的获取到所有data-开头的自定义属性数据 -->
  <p data-name='jack' data-age='20'>我是p元素</p>
  <script>
    // let data = document.querySelector('p').dataset
    // let name = document.querySelector('p').dataset.name
    // let age = document.querySelector('p').dataset['age']
    // console.log(name, age)
    // data:在jq中，通过data()就可以获取自定义属性的值，它可以获取当前元素中所有data-开头的自定义属性值，并生成一个对象
    console.log($('p').data())
    console.log($('p').data().name)
    console.log($('p').data('age'))
  </script>
</body>

</html>